<template>
      <a-modal
        :visible="visible"
        title="评教详情"
        :width="1080"
        :confirmLoading="confirmLoading"
        @cancel="() => { $emit('cancel') }"
    >
        <a-row>
            <a-col :span="8">
                班级：{{courseInfo.jxbh}}
            </a-col>
            <a-col :span="8">
                课程：{{courseInfo.kcmc}}
            </a-col>
            <a-col :span="8">
                参与评分人数：{{sum}}人
            </a-col>
        </a-row>
        <a-card :bordered="false" style="margin-top: 10px">
        <s-table
            ref="table"
            size="default"
            :columns="columns"
            :data="loadData"
            :alert="{ show: false }"
            :pageSize="1000"
            bordered
            :scroll="{ y: 450 }"
        >
            <span slot="customTitle"> 均差
                <a-tooltip placement="top" title="均差值为同一学期个人项目平均分与全校教师该项目平均分的差值" > 
                    <a-icon type='question-circle-o' style=" margin-left: 23px;font-size:12px;color:#999;" />
                </a-tooltip>
            </span>
        </s-table>
        </a-card>
        <template slot="footer">
            <a-button key="back" @click="() => { $emit('cancel') }">
                关闭
            </a-button>
        </template>
    </a-modal>
</template>

<script>
import { STable } from '~'
export default {
    name: 'TeaEduDetail',
    props: {
        visible: Boolean,
        typeUser: '',
        courseInfo: {
        type: Object,
        default () {
            return {}
        }
    },
    confirmLoading: Boolean
  },
  watch:{
      visible(value){
          if(value){
                this.$refs.table.refresh(true)
          }
      },
  },
   data(){
        return{
            sum: '',
            show: false,
            queryParam: {},
            pjnl: '',
            dataList: {},
            list: {},
            columns:[
                {
                    title: '评价项目',
                    dataIndex: 'pjxm',
                    width: '160px',
                    scopedSlots: { customRender: 'pjxm' },
                    customRender: (value, row, index) => {
                        console.log(value, row, index)
                        const obj = {
                            children: (
                                <div>
                                    {value}
                                    <span style="color: red;">*</span>
                                </div>
                            ),
                            attrs: {},
                        };
                        if(row.seq >= 1){   // 第一行数据开始，跨行合并的长度为数据data的长度
                            obj.attrs.rowSpan = row.childSize;
                        }
                        if (row.seq >= 2 ) {   // 从第一行往后的所有行表格均合并
                            obj.attrs.rowSpan = 0;
                        }
                        
                        return obj;
                    }
                },
                {
                    title: '序号',
                    dataIndex: 'seq',
                    width: '80px',
                    
                    
                },
                {
                    title: '项目要素',
                    dataIndex: 'name',
                    width:'300px' 
                    
                },
                {
                    title: '评价分数（百分制）',
                    dataIndex: 'df',
                    width:'175px' 
                },
                {
                    dataIndex: 'jc',
                    width: '100px',
                    slots: { title: 'customTitle' },
                    
                },
                {
                    title: '小计',
                    dataIndex: 'xj',
                    width: '100px',
                    customRender: (value, row, index) => {
                        console.log(value, row, index)
                        const obj = {
                            children: (
                                <div>
                                    {value}
                                </div>
                            ),
                            attrs: {},
                        };
                        if(row.seq >= 1){   // 第一行数据开始，跨行合并的长度为数据data的长度
                            obj.attrs.rowSpan = row.childSize;
                        }
                        if (row.seq >= 2 ) {   // 从第一行往后的所有行表格均合并
                            obj.attrs.rowSpan = 0;
                        }
                        return obj;
                    }
                },
                {
                    title: '均差',
                    dataIndex: 'jcavg',
                    customRender: (value, row, index) => {
                        console.log(value, row, index)
                        const obj = {
                            children: (
                                <div style={{color:value<0?'red':(value>0?'#52c41a':'#999')}}>
                                    {value>0?'+'+value:value}
                                </div>
                            ),
                            attrs: {},
                        };
                        if(row.seq >= 1){   // 第一行数据开始，跨行合并的长度为数据data的长度
                            obj.attrs.rowSpan = row.childSize;
                        }
                        if (row.seq >= 2 ) {   // 从第一行往后的所有行表格均合并
                            obj.attrs.rowSpan = 0;
                        }
                        return obj;
                    }
                },
            ],
            parameter: {
                pageNo: 1,
                pageSize: 10
            },
            loadData: parameter => {
                this.parameter = parameter
                parameter.pageNum = parameter.pageNo
                let url = ''
                    console.log(this.typeUser)
                if(this.typeUser == 'dd'){
                    console.log(111111111)
                    url = this.$api.student.ddEduDetail(this.courseInfo.pkxxId)
                }else{
                    console.log(22222222222)
                    url = this.$api.student.teaEduDetail(this.courseInfo.pkxxId)
                }
                return url.then(res => {
                    console.log(res)
                    this.dataList = res.data
                    this.sum = res.others.sum
                    let newData = []
                    res.data.map(item=>{
                        console.log(item.dfList.length,item.seq)
                        item.dfList.map(it=>{
                            it.pjxm = item.name
                            it.pjseq = item.seq
                            it.childSize = item.dfList.length
                            it.df = it.df.toFixed(1)
                            it.jc = (it.df - it.dfAvg).toFixed(1)
                            it.xj = item.df.toFixed(1)
                            it.jcavg = (item.df - item.dfAvg).toFixed(1)
                        })
                        newData = newData.concat(item.dfList) 
                    })
                    console.log(newData,1111111)
                    // newData.push({pjxm: '对本门课程教学的意见和建议：',pjseq: 1100,seq:"",name:''})
                    return this.list = {
                        data: newData,
                        pageNo: parameter.pageNum,
                        pageSize: parameter.pageSize,
                        totalPage: Math.ceil(res.data.total / parameter.pageSize),
                        totalCount: res.data.total
                    }
                })
            },
        }
    },
  components: {
    STable
  },
  methods: {
    
  }
}
</script>

<style lang="less">


</style>